import { NGrid, NGridItem, NCard } from "naive-ui";
import PageScroll from "@/components/pageScroll";

export default defineComponent({
  name: "PageLayout",
  setup() {
    return () => (
      <div class=" h-full flex overflow-hidden">
        <PageScroll
          bgStyle={{
            background: "none",
          }}
        >
          <NGrid xGap={10} yGap={10} cols={6}>
            <NGridItem span={6}>
              <NCard class="bg-red" title="卡片" bordered={false}>
                卡片内容1
              </NCard>
            </NGridItem>
            <NGridItem span={4}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={2}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={2}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={4}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={3}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={3}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={2}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={2}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={2}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
            <NGridItem span={6}>
              <NCard title="卡片" bordered={false}>
                卡片内容
              </NCard>
            </NGridItem>
          </NGrid>
        </PageScroll>
      </div>
    );
  },
});
